<g:applyLayout name="main">
<html>
  <head>
    <link rel="stylesheet" href="${resource(dir:'css',file:'menu.css')}" />
    <script type='text/javascript' src='/js/jquery/vertical-menu/jquery.hoverIntent.minified.js'></script>
    <script type='text/javascript' src='/js/jquery/vertical-menu/jquery.dcverticalmegamenu.1.3.js'></script>
    <script type="text/javascript">
      jQuery(document).ready(function($) {
        $('#car-menu').dcVerticalMegaMenu();
      });
    </script>
    <g:layoutHead />
  </head>
  <body>
    <table>
      <tr>
        <td>
          <ul id="car-menu" class="mega-menu">
            <ebay:categories />
            <g:each in="${categories}" var="brand">
              <g:if test="${brand.children}">
                <li>
                  <a href="#">${brand.name}</a>
                  <ul>
                    <g:each in="${brand.children}" var="model">
                      <li>
                        <a href="/price/${brand.name}/${model.name}?modelId=${model.id}">${model.name}</a>
                      </li>
                    </g:each>
                  </ul>
                </li>
              </g:if>
            </g:each>
          </ul>
        </td>
        <td class="text">
          <g:layoutBody />
        </td>
      </tr>
    </table>
  </body>
</html>
</g:applyLayout>